<style>
.div-page{
    padding: 2em 0;
}
.action button{
    margin-right: 20px;
}
.notice{
    font-style: italic;
    color: darkgrey;
}
.panel {
    margin-bottom: 10px;
    border: 0;
}
</style>
<div class="row-fluid clearfix">
    <div class="col-md-12 column">
        <ul class="breadcrumb">
            <li>
                <a href="index.html">首页</a>
            </li>
            <li class="active">
                800白名单
            </li>
        </ul>
    </div>
    <div class="col-md-12 column">
        <div class="col-sm-12 div-page">
            <div style="width: 90%;height:460px;overflow:hidden;margin:auto">
                <form id="validForm" method="get" action="#" class="form-horizontal layer_msg">
                    <div class="col-sm-12 hide">
                        <label class="col-sm-2 control-label">客户类型</label>
                        <div class="form-group col-sm-4">
                            <input type="text" class="form-control" data-field="customertype" id="customertype" name="customertype" value="1"/>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <label class="col-sm-2 control-label">绑定电话</label>
                        <div class="form-group col-sm-4">
                            <input type="text" class="form-control" data-field="bindphone" id="bindphone" name="bindphone" placeholder="固话格式：区号-直播号" maxlength="13"/>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <label class="col-sm-2 control-label"></label>
                        <div class="form-group col-sm-6">
                            <button id="queryCIF" type="button" class="btn btn-primary">查 询</button>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <label class="col-sm-10 control-label"></label>
                        <div class="form-group col-sm-2">
                            <button id="toExcell" type="button" class="btn btn-link hide" style="text-align: center">白名单数据导出</button>
                        </div>
                    </div>

                </form>
                <div class="panel panel-default result hide" style="height: 280px">
                    <ul class="list-group col-sm-12">
                        <li class="list-group-item">查询结果 </li>
                    </ul>
                    <ul class="list-group col-sm-6">
                        <li class="list-group-item hide">用户编号： <span id="UserId"></span></li>
                        <li class="list-group-item">用户名称： <span id="UseName"></span></li>
                        <li class="list-group-item">绑定卡号： <span id="CardNo"></span></li>
                        <li class="list-group-item">证件类型： <span id="CertifiType"></span></li>
                        <li class="list-group-item">证件号码： <span id="CertifiNo"></span></li>
                        <li class="list-group-item">绑定电话： <span id="BindPhone1"></span></li>
                    </ul>
                    <ul class="list-group col-sm-6">
                        <li class="list-group-item">设备编号： <span id="DeviceId"></span></li>
                        <li class="list-group-item">密码键盘编号： <span id="SafeDevId1"></span></li>
                        <li class="list-group-item">扣费状态： <span id="ChargeState"></span></li>
                        <li class="list-group-item">白名单状态： <span id="IsExist"></span></li>
                        <li class="list-group-item">ABISCode： <span id="ABISCode"></span></li>
                    </ul>
                    <div class="col-sm-12 hide"></div>
                </div>
                <div class="action hide">
                    <button id="add" type="button" class="btn btn-primary hide">添加到白名单</button>
                    <button id="delete" type="button" class="btn btn-danger hide">从白名单中删除</button>
                </div>
            </div>

        </div>
    </div>
</div>
<div id="tableExcel" class="hide">
    <table id="test" width="100%" border="1" cellspacing="0" cellpadding="0">
        <tr>
            <td>绑定卡号</td><td>欠费状态</td><td>用户号</td><td>用户状态</td>
        </tr>
    </table>
</div>
<script>
    $(function(){
        //"白名单数据导出"按钮权限控制
        if($.cookie("OperClass")==10){
            $("#toExcell").removeClass("hide");
        }

        //“查询”按钮点击事件注册
        $("#queryCIF").click(function(){
            var querymode="",querykeyword="";
            var phone=$.trim($("#bindphone").val()),reg;
            reg=/0\d{2,3}-\d{5,9}|0\d{2,3}-\d{5,9}/g.test(phone);
            if(!reg)
            {
                alert("固话号码格式错误！");
                return;
            }
            querymode="3";
            querykeyword= $.trim($("#bindphone").val());
            $.ajax({
                type: "get",
                async:false,
                datatype:"json",
                //url: "../json/800CIF.json",
                url: globalUrl+"api/WhiteList?customertype="+$("#customertype").val()+"&querymode="+querymode+"&querykeyword="+querykeyword,
                success: function (resp) {
                    if(resp.result)
                    {
                        $("#UserId").html(resp.data.UsrNo);
                        $("#ABISCode").html(resp.data.ABISCode);
                        $("#UseName").html(resp.data.UseName);
                        $("#CardNo").html(resp.data.CardNo);
                        $("#CertifiType").html(resp.data.CertifiType);
                        $("#CertifiNo").html(resp.data.CertifiNo);
                        $("#BindPhone1").html(resp.data.BindPhone);
                        $("#DeviceId").html(resp.data.DeviceId);
                        $("#SafeDevId1").html(resp.data.SafeDevId);
                        var IsExist=resp.data.IsExist,IsExistText,ChargeState=resp.data.ChargeState,ChargeStateText="";
                        /*if(IsExist==0)
                        {
                            $("#delete").addClass("hide");
                            IsExistText="未添加到白名单";
                        }
                        else
                        {
                            $("#add").addClass("hide");
                            IsExistText="已添加到白名单";
                        }*/
                        if(IsExist==0)
                        {
                            IsExistText="未添加到白名单";
                        }
                        else
                        {
                            $("#delete").removeClass("hide");
                            IsExistText="已添加到白名单";
                        }
                        if(ChargeState==0)
                        {
                            ChargeStateText="欠费";
                        }
                        else if(ChargeState==1)
                        {
                            ChargeStateText="正常";
                        }
                        $("#ChargeState").html(ChargeStateText);
                        $("#IsExist").html(IsExistText);
                        next();
                    }
                    else
                    {
                        alert(resp.msg);
                    }
                },
                error:function(){
                    alert("后台未成功返回！");
                }
            });

        });

        //"白名单数据导出"按钮点击事件注册
        $("#toExcell").click(function(){
            if(confirm("确定要导出数据吗？"))
            {
                location.href = globalUrl + "api/WhiteList";
            }
        });

        //"添加到白名单"按钮点击事件注册
        $("#add").click(function(){
            $.ajax({
                type: "post",
                //async:false,
                data:{
                    PhoneNo: $("#BindPhone1").html(),
                    CardNo:$("#CardNo").html()
                },
                datatype:"json",
                url: globalUrl+"api/WhiteList",
                success: function (resp) {
                    alert(resp.msg);
                    back();
                },
                error:function(){
                    alert("后台未成功返回！");
                }
            });

        });

        //"从白名单中删除"按钮点击事件注册
        $("#delete").click(function(){
            if(confirm("确定要删除吗？"))
            {
                $.ajax({
                    type: "delete",
                    //async:false,
                    datatype:"json",
                    url: globalUrl+"api/WhiteList?usrno="+$("#UserId").html(),
                    success: function (resp) {
                        alert(resp.msg);
                        back();
                    },
                    error:function(){
                        alert("后台未成功返回！");
                    }
                });
            }
        });
    });

    //跳转到查询结果页面
    function next(){
        $("#validForm").addClass("hide");
        $(".result,.action").removeClass("hide");
    }

    //跳转到查询页面
    function back(){
        $("#validForm").removeClass("hide");
        $(".result,.action").addClass("hide");
        $("#bindphone").val("");
        $("#safedevid").val("");
        bindphoneOld="";
        safedevidOld="";
        $("#add,#delete").addClass("hide");
    }
</script>